<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>控制内容</title>
    <style>
        #scrollBar {
            height: 300px;
            width: 20px;
            border-radius: 10px;
            background-color: #ccc;
            position: absolute;
            right: 0;
            top: 0;
        }
        
        #scroll {
            width: 20px;
            height: 50px;
            border-radius: 10px;
            background-color: #f00;
            position: absolute;
            left: 0;
            top: 0;
        }
        
        .box {
            position: relative;
            width: 300px;
            height: 300px;
        }
        
        .content {
            height: 300px;
            width: 280px;
            margin-right: 20px;
            overflow: hidden;
            position: relative;
            background-color: pink;
        }
        
        #scrollCont {
            width: 100%;
            position: absolute;
            left: 0;
            top: 0;
        }
    </style>
</head>

<body>
    <div class="box">
        <div class="content" id="content">
            <div class="scrollCont" id="scrollCont">
                <p>这里是滚动的内容 开始</p>
                <p>　新华社北京８月２０日电 题：以“四个伟大”书写时代新篇章——贯彻落实习近平总书记在省部级专题研讨班重要讲话精神系列述评之四 　　新华社记者 刘铮、罗争光、谭谟晓 　　时代是思想之母，实践是理论之源。 　　习近平总书记日前在省部级主要领导干部专题研讨班上发表重要讲话时指出，在新的时代条件下，我们要进行伟大斗争、建设伟大工程、推进伟大事业、实现伟大梦想，仍然需要保持和发扬马克思主义政党与时俱进的理论品格，勇于推进实践基础上的理论创新。 　　回顾党的十八大以来以习近平同志为核心的党中央，带领中国人民统筹推进“五位一体”、协调推进“四个全面”的奋斗历程，展望发展进入新阶段的新情况新使命，“四个伟大”内涵丰富而又形成一个逻辑严密的有机整体，构成了当代中国最具时代特色的伟大实践，同时又对理论创新提出了新的要求。
                    　　时代呼唤：“四个伟大”集中体现了党的十八大以来以习近平同志为核心的党中央治国理政新理念新思想新战略，凸显了新的历史条件下中国共产党肩负的使命和担当 　　党的十八大以来，在新中国成立特别是改革开放以来我国发展取得的重大成就基础上，党和国家事业发生历史性变革，我国发展站到了新的历史起点上，中国特色社会主义进入了新的发展阶段。 　　中国今非昔比。在经济总量方面，２０１６年中国经济占世界经济比重达到１４．９％，对世界经济增长贡献率高达３４．７％，而１９７８年比重只有１．８％，贡献率为２．３％。在居民收入方面，２０１６年全国城镇、农村人均收入分别超过３．３万元、１．２万元，而１９７８年只有３００多元、１００多元。
                    　　美国哈佛大学教授约瑟夫·奈认为，从大的历史背景看，中国创造了非同凡响的转型，这是伟大的成功故事。中国成为一个有责任提供全球公共产品的大国，中国看自己和世界看中国的态度都在改变。 　　特别是党的十八大以来，经济新常态的提出引领中国经济发展进入转型升级新阶段；五大发展理念的实践，正在推动一场关系发展全局的深刻变革；全面从严治党使党风政风为之一新，人民群众对党风廉政建设和反腐败工作的满意度，从２０１３年的８１％提高到２０１６年的９２．９％…… 　　这些历史性变革，正是在中国共产党的坚强领导下，通过进行具有新的历史特点的伟大斗争所取得的，是由全面从严治党的伟大工程保障的，是沿着中国特色社会主义伟大事业的道路坚定前进的，是在中华民族伟大复兴梦想的感召下全国人民共同努力的结果。
                    　　“理解‘四个伟大’，要紧紧扣住党的十八大以来，时代和历史方位发生的转变。”中央党校教授辛鸣说，以习近平同志为核心的党中央治国理政解决了许多长期想解决而没有解决的难题，办成了许多过去想办而没有办成的大事，时代和历史方位发生转变。 　　“四个伟大”的演进历程，折射出我们党实践和理论创新的品格。 　　改革开放以来，在党的许多重要文献中把“伟大事业”同“伟大工程”联系起来讲，意在将改造客观世界与改造主观世界联系起来，把“打铁”与“自身硬”联系起来。 　　党的十八大报告首次提出：发展中国特色社会主义是一项长期的艰巨的历史任务，必须准备进行具有许多新的历史特点的伟大斗争。这与发展起来以后遇到更多的难题、挑战有关，与打的“铁”更加坚硬有关。
                    　　党的十八届六中全会，将“伟大斗争、伟大工程、伟大事业”并提。 　　中央党校副教育长韩庆祥说，习近平总书记完整提出“进行伟大斗争、建设伟大工程、推进伟大事业、实现伟大梦想”，是在我国进入决胜全面小康、开启社会主义现代化新征程的重要历史节点作出的重大理论创新。 　　“从‘三个伟大’到‘四个伟大’，不仅把我们党正在做的事情更加完整地凸显出来了，而且体现了手段、路径与目标高度统一的内在逻辑。”中共中央政策研究室原副主任施芝鸿认为。 　　时代变革对“四个伟大”提出新要求。
                    　　在新的历史起点上，机遇前所未有，挑战也前所未有。 　　“行百里者半九十。离宏伟目标越近，越是充满了艰难险阻。如果说追赶阶段还有一些现成经验可以借鉴的话，超越阶段则更多依靠自身的探索。”国家行政学院教授刘东超说，“四个伟大”包含着对第一个百年目标的冲刺，以及第二个百年目标的开启的系统性、战略性安排，体现了大局意识、长远意识、整体意识、全局意识。 　　在新的发展阶段，会遇到新的问题和更多难题。要跨越中等收入陷阱、突破利益固化藩篱，要补上短板、提质增效，要应对复杂环境、激浊扬清，离不开不断创新和突破，必须迎着矛盾向前走。
                    　　“‘中国世纪’是完全有可能到来的，但它不会从天上掉下来。”新加坡国立大学东亚研究所所长郑永年说，中国当前面临的问题很多，包括经济下行压力、环保问题、国际地缘政治变化等等，要注意防范“颠覆性错误”。 　　习近平总书记指出，２０２０年全面建成小康社会后，我们要激励全党全国各族人民为实现第二个百年奋斗目标而努力，踏上建设社会主义现代化国家新征程，让中华民族以更加昂扬的姿态屹立于世界民族之林。 　　“未来要通过破解大矛盾赢得大发展，解决大问题实现大进步，确保实现第一个百年目标，为第二个百年目标打好基础，这是时代赋予我们的使命和担当。”辛鸣说。
                </p>
            </div>
        </div>
        <div id="scrollBar">
            <div id="scroll"></div>
        </div>
    </div>
</body>
<script>
    var oContent = document.getElementById("content");
    var scrollCont = document.getElementById("scrollCont");
    var slider = document.getElementById("scroll");
    var scrollBar = document.getElementById("scrollBar");
    slider.onmousedown = function(e) {
        var e = e || window.event;
        var _this = this;
        var y = e.clientY - _this.offsetTop;
        document.onmousemove = function(e) {
            var e = e || window.event;
            var t = e.clientY - y;
            if (t <= 0) t = 0;
            if (t >= scrollBar.offsetHeight - _this.offsetHeight) t = scrollBar.offsetHeight - _this.offsetHeight;
            _this.style.top = t + 'px';
            var scale = t / (scrollBar.offsetHeight - _this.offsetHeight);
            scrollCont.style.top = -scale * (scrollCont.offsetHeight - oContent.offsetHeight) + 'px';
        }
        document.onmouseup = function() {
            document.onmousemove = null;
            document.onmouseup = null;
        }
    }
</script>

</html>